<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数组reduce方法</title>
</head>
<body>
<p>
    Array 是内置的构造函数，用于创建数组 <br>
    了解下,一般不使用 Array,创建数组
</p>

<h3>数组常见实例方法-核心方法</h3>
<pre style="font-size: 20px; font-style: normal;">
  方法    作用          说明
forEach 遍历数组  不返回，用于不改变值，经常用于查找打印输出值
filter  过滤数组  筛选数组元素，并生成新数组
map     迭代数组  返回新数组，新数组里面的元素是处理之后的值，经常用于处理数据
reduce  累计器    返回函数累计处理的结果，经常用于求和
</pre>
<hr>

<p>
    前3个前面课程讲解个,这里不在说明 <br>
    这里讲解 reduce 方法
</p>
<p>
    基础语法: <br>
    数组.reduce(function(){}, 起始值) <br>
    参数： 起始值可以省略，如果写就作为第一次累计的起始值
</p>
<p>
    语法: <br>
    数组.reduce(function(累计值, 当前元素, [索引号], [源数组]){}, 起始值) <br>
    累计值参数： <br>
    1. 如果有起始值，则以起始值为准开始累计， 累计值 = 起始值 <br>
    2. 如果没有起始值， 则累计值以数组的第一个数组元素作为起始值开始累计 <br>
    3. 后面每次遍历就会用后面的数组元素 累计到 累计值 里面 （类似求和里面的 sum ）
</p>


<script>
    // Array，用于创建数组
    let 数字数组 = new Array(1, 2, 3, 4, 5, 6)
    console.log(数字数组) // 输出的是, 数组

    // -------- reduce方法 遍历数组,返回一个值--------
    // 没有起始值, 累计值 就是数组的第一个元素
    let 和 = 数字数组.reduce(function (累计值, 当前元素) {
        return 累计值 += 当前元素
    })
    console.log(和)

    // 有起始值, 相当于 数组的和+10
    let 和1 = 数字数组.reduce(function (累计值, 当前元素) {
        return 累计值 += 当前元素
    }, 10) // 起始值,设置10
    console.log(和1) // 结果是, 数组的总和+10

    // 箭头函数的写法
    let 和3 = 数字数组.reduce((累计值, 当前元素) => 累计值 += 当前元素, 10)
    //                      括号是参数     只有一行情况,写在一行里      10是,起始值
    console.log(和3)


    /*
    案例: 员工涨薪计算成本
    需求：
    ①：给员工每人涨薪 30%
    ②：然后计算需要支出的费用
    */
    const 员工信息_对象 = [{
        姓名: '张三',
        薪资: 10000
    }, {
        姓名: '李四',
        薪资: 10000
    }, {
        姓名: '王五',
        薪资: 10000
    },
    ]

    // 这里有个小问题,初始值要加. 因为数组的第一个元素是对象, 对象不能相加啊,所以先加一个初始值,以后相加的是对象里的属性
    let 员工涨薪后成本 = 员工信息_对象.reduce((累计和, 元素) => 累计和 += 元素.薪资 * 1.3, 0)
    console.log(`员工总薪资是: ${员工涨薪后成本}`)

</script>
</body>
</html>